<template>
  <div class="app-box" v-title data-title="小通币咚" id="rsuccesss-box">
    <div class="succBg">
        <section>
           <p class="icon"></p>
           <p class="text">恭喜您注册成功</p>
           <div class="btn"  @click="download">点击下载APP,查看额度</div>
        </section>
    </div>
  </div>
</template>
<script>
import { CellFormPreview, Group, XInput, Flexbox, FlexboxItem, CheckIcon, XButton, Alert } from 'vux'
import { getimages, yanzhenimage, getsendMsg, registMember } from '@/api/guide'

export default {
  components: {
    CellFormPreview,
    Group,
    XInput,
    Flexbox,
    FlexboxItem,
    CheckIcon,
    XButton,
    Alert
  },
  data() {
    return {
      browser: {}
    }
  },

  created() {
  },

  methods: {
     versions() {
      var u = navigator.userAgent
      var app = navigator.appVersion
      this.browser.mobile = !!u.match(/AppleWebKit.*Mobile.*/) //是否为移动终端
      this.browser.webKit = u.indexOf('AppleWebKit') > -1 //苹果、谷歌内核
      this.browser.ios = u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) //ios终端
      this.browser.android = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 //android终端或uc浏览器
    },
    download() {
      this.versions()
      var locationhref = 'https://itunes.apple.com/cn/app/%E5%B0%8F%E9%80%9A%E5%B8%81%E5%92%9A/id1303624175?mt=8'
      if (this.browser.android) { // android 下载地址
        locationhref = 'http://sj.qq.com/myapp/detail.htm?apkName=com.allinpay.bidong'
      }
      window.location.href = locationhref
    }
  }

}

</script>
<style>
#rsuccesss-box,#rsuccesss-box .succBg{
  background:#5621b2;
  width:100%;
  height: 100%;
  padding-bottom:20px;
}
#rsuccesss-box .succBg{
/*  height:auto;*/
height:100%;
  background: url('../assets/rsuccess_bg.png') center top no-repeat;
  background-size:100% 100%;  
  position:absolute;  
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bg-login.png',sizingMethod='scale');  
}
#rsuccesss-box .succBg section{
  background:#fff;
  margin:0 auto;
  margin-top:80%;
  width:90%;
  height: auto;
  padding-bottom:10%;
  border-radius: 10px;
}
#rsuccesss-box .succBg section .btn{
  border-radius: 10px;
  text-align: center;
  color:#fff;
  padding:0;
  border:0;
  width:90%;
  height:40px; 
  font-size: 16px;
  margin:0px auto;
  line-height: 40px;
  box-shadow:0 0 5px 0px #00ceff;
  background: -webkit-linear-gradient(left, #00ceff , #007aff); /* Safari 5.1 - 6.0 */
  background: -o-linear-gradient(right, #00ceff , #007aff); /* Opera 11.1 - 12.0 */
  background: -moz-linear-gradient(right, #00ceff , #007aff); /* Firefox 3.6 - 15 */
  background: linear-gradient(to right, #00ceff , #007aff); /* 标准的语法 */  
}
#rsuccesss-box .succBg section .icon{
  padding-top:40%;
  margin:0 auto;
  background: url('../assets/icon_success.png') center bottom no-repeat;
  width:20%;
  background-size:100%; 

}
#rsuccesss-box .succBg section .text{
  text-align: center;
  font-size:20px;
  color:#222;
  line-height:40px;
  margin-bottom:15%;
}
</style>
